<template>
  <div class="mt-20px">
    <div class="search-list">
      <div class="left">
        <div class="item">
          <div class="label">支付时间</div>
          <el-date-picker
            v-model="searchParams.searchTime"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          />
        </div>
        <div class="item">
          <div class="label">客户</div>
          <el-input
            v-model="searchParams.keyword"
            style="width: 240px"
            placeholder="请输入客户姓名/手机号"
            :suffix-icon="Search"
          />
        </div>
      </div>
    </div>
    <div class="table-wrap">
      <el-table :data="tableData">
        <el-table-column prop="id" label="ID" width="100" />
        <el-table-column prop="orderNo" label="订单号" />
        <el-table-column prop="orderNo" label="订单号" />
        <el-table-column prop="orderNo" label="订单号" />
        <el-table-column prop="orderNo" label="订单号" />
        <el-table-column prop="orderNo" label="订单号" />
        <el-table-column prop="orderNo" label="订单号" />
        <el-table-column prop="orderNo" label="订单号" />
        <el-table-column prop="orderNo" label="订单号" />
      </el-table>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { Search } from '@element-plus/icons-vue'
defineOptions({ name: 'ClassroomRentalOrder' })
// 查询form
const searchParams = reactive({
  searchTime: [],
  keyword: '',
})
// 表格数据
const tableData = ref([])
</script>

<style scoped lang="scss"></style>
